<template>
    <div class="login-main">
        <div class="find-pwd-main">
            <div class="find-pwd-box">
                <div class="title">
                    找回密码
                    <span>
                        已有帐号去
                        <router-link to="/login">登录</router-link>
                    </span>
                </div>
                <div class="find-pwd-body">
                    <div class="form-group">

                        <input type="text" placeholder="邮箱名" v-model="email">
                    </div>
                    <div class="form-group clearfix">
                        <!-- <input class="verify-input" type="text" placeholder="验证码">
                        <div class="verify-img"></div> -->
                        <input type="text" placeholder="验证码" class="verify-input" v-model="verifyValue">
		               
                        <div class="verify-img" id="v_container"></div>
                    </div>

                    <div class="form-group">
                        <button @click="sendMail">
                            下一步
                        </button>
                    </div>
                </div>
            </div>
            <div class="copyright">
                Copyright © 2017 上海企想信息技术有限公司. All rights reserved.
            </div>
        </div>

    </div>
</template>

<script>
import "../../assets/js/gVerify";
export default {
  data() {
    return {
      email: "",
      verifyValue: "",
      verifyCode: "",
      emailFlag: false,
      verifyFlag: false,
      resultFlag: false
    };
  },
  mounted() {
    this.verifyCode = new GVerify("v_container");
  },
  methods: {
    verificat() {
      let result = this.verifyCode.validate(this.verifyValue);
      let emialRule = /^([a-zA-Z0-9]+[_|\_|\.]?)*[a-zA-Z0-9]+@([a-zA-Z0-9]+[_|\_|\.]?)*[a-zA-Z0-9]+\.[a-zA-Z]{2,3}$/;
      if (!emialRule.test(this.email)) {
        this.$Modal.error({
          content: "<p>邮箱格式不正确!</p>"
        });
        return false;
      } else {
        this.emailFlag = true;
      }
      if (!result) {
        this.$Modal.error({
          content: "<p>验证码不正确!</p>"
        });
        return false;
      } else {
        this.verifyFlag = true;
      }

      if (this.emailFlag && this.verifyFlag) {
        this.resultFlag = true;
        return this.resultFlag;
      }
    },
    sendMail() {
      if (this.verificat()) {
        // this.$router.push({
        //     path: '/SendMail'
        // })
        this.$ajax
          .post("/api/login/info/sendEmail", `email=${this.email}`)
          .then(response => {
            console.log(response.data);
            if (response.data.code == 1) {
                this.$Modal.success({
                        title: "成功",
                        content: "发送成功！"
                });
              this.$router.push({
                  query:{
                      emailAddress:this.email
                  },
                  
                  path: '/SendMail'
              })
            } else {
              this.$Modal.error({
                content: response.data.msg
              });
            }
          });
      }
    }
  }
};
</script>

<style>

</style>
